<template>
	<view>
		<!-- 话题介绍 -->
		<topic-info :item="topicInfo"></topic-info>
		<!-- tabbar切换 -->
		<swiper-tab-head :tabBars="tabBars" :tabIndex="tabIndex" @tabtap="tabtap" tabItemStyle="width:50%" scrollStyle="border-bottom:none"></swiper-tab-head>
		<!-- 列表 -->
		<view class="topic-detail-list">
			<block v-for="(item,index) in tabList" :key="index">
				<template v-if="tabIndex === index">
					<!-- 列表 -->
					<block v-for="(list,indey) in item.list" :key="indey">
						<common-list :item="list" :index="indey"></common-list>
					</block>
					<!-- 上拉加载-->
					<load-more :loadtext="item.loadtext"></load-more>
				</template>
			</block>
		</view>
	</view>
</template>

<script>
	import topicInfo from "../../components/topic/topic-info.vue"
	import swiperTabHead from "../../components/index/swiper-tab-head.vue"
	import commonList from "../../components/common/common-list.vue"
	import loadMore from "../../components/common/load-more.vue"
	export default {
		data() {
			return {
				topicInfo: {
					titlepic: "../../static/image/topicpic/13.jpeg",
					title: "话题名称话题名称2",
					desc: "我是话题描述2",
					totalnum: 40,
					todaynum: 30
				},
				tabIndex: 0,
				tabBars: [{
						name: "默认",
						id: "moren"
					},
					{
						name: "最新",
						id: "zuixin"
					}
				],
				tabList: [{
						loadtext: "上拉加载更多",
						list: [{
								userpic: "../../static/image/userpic/12.jpg",
								username: "哈哈哈",
								sex: 1, // 0: 男, 1: 女
								age: 23,
								isfollow: false,
								title: "我是标题",
								titlepic: false,
								video: false,
								share: false,
								site: "深圳 龙岗",
								sharenum: 20,
								commentnum: 30,
								goodnum: 40
							},
							{
								userpic: "../../static/image/userpic/12.jpg",
								username: "哈哈哈",
								sex: 1, // 0: 男, 1: 女
								age: 23,
								isfollow: false,
								title: "我是标题",
								titlepic: false,
								video: false,
								share: false,
								site: "深圳 龙岗",
								sharenum: 20,
								commentnum: 30,
								goodnum: 40
							},
							{
								userpic: "../../static/image/userpic/12.jpg",
								username: "哈哈哈",
								sex: 1, // 0: 男, 1: 女
								age: 23,
								isfollow: false,
								title: "我是标题",
								titlepic: false,
								video: false,
								share: false,
								site: "深圳 龙岗",
								sharenum: 20,
								commentnum: 30,
								goodnum: 40
							},
							{
								userpic: "../../static/image/userpic/12.jpg",
								username: "哈哈哈",
								sex: 1, // 0: 男, 1: 女
								age: 23,
								isfollow: false,
								title: "我是标题",
								titlepic: false,
								video: false,
								share: false,
								site: "深圳 龙岗",
								sharenum: 20,
								commentnum: 30,
								goodnum: 40
							},
							{
								userpic: "../../static/image/userpic/12.jpg",
								username: "哈哈哈",
								sex: 1, // 0: 男, 1: 女
								age: 23,
								isfollow: false,
								title: "我是标题",
								titlepic: false,
								video: false,
								share: false,
								site: "深圳 龙岗",
								sharenum: 20,
								commentnum: 30,
								goodnum: 40
							},
							{
								userpic: "../../static/image/userpic/12.jpg",
								username: "哈哈哈",
								sex: 1, // 0: 男, 1: 女
								age: 23,
								isfollow: false,
								title: "我是标题",
								titlepic: false,
								video: false,
								share: false,
								site: "深圳 龙岗",
								sharenum: 20,
								commentnum: 30,
								goodnum: 40
							},
							{
								userpic: "../../static/image/userpic/12.jpg",
								username: "哈哈哈",
								sex: 1, // 0: 男, 1: 女
								age: 23,
								isfollow: false,
								title: "我是标题",
								titlepic: false,
								video: false,
								share: false,
								site: "深圳 龙岗",
								sharenum: 20,
								commentnum: 30,
								goodnum: 40
							}
						]
					},
					{
						loadtext: "上拉加载更多",
						list: [{
							userpic: "../../static/image/userpic/12.jpg",
							username: "哈哈哈",
							sex: 1, // 0: 男, 1: 女
							age: 23,
							isfollow: false,
							title: "我是标题",
							titlepic: false,
							video: false,
							share: false,
							site: "深圳 龙岗",
							sharenum: 20,
							commentnum: 30,
							goodnum: 40
						}]
					}
				]
			};
		},
		methods: {
			// 点击切换
			tabtap(index) {
				this.tabIndex = index
			},
			// 加载更多 默认
			loadMore() {
				if (this.tabList[this.tabIndex].loadtext !== "上拉加载更多") {
					return
				}
				let obj = {
					userpic: "../../static/image/userpic/12.jpg",
					username: "哈哈哈",
					sex: 1, // 0: 男, 1: 女
					age: 23,
					isfollow: false,
					title: "我是标题",
					titlepic: false,
					video: false,
					share: false,
					site: "深圳 龙岗",
					sharenum: 20,
					commentnum: 30,
					goodnum: 40
				}
				// 修改状态
				this.tabList[this.tabIndex].loadtext = "拼命加载中. . ."
				setTimeout(() => {
					this.tabList[this.tabIndex].list.push(obj)
					this.tabList[this.tabIndex].loadtext = "上拉加载更多"
					// this.attention.loadtext = "人家是有底线的 Ծ ‸ Ծ"
				}, 1000)
			},
			// 获取数据
			getData() {

			}
		},
		components: {
			topicInfo,
			swiperTabHead,
			commonList,
			loadMore
		},
		// 上拉加载
		onReachBottom() {
			this.loadMore()
		},
		// 下拉刷新
		onPullDownRefresh() {
			this.getData()
			setTimeout(() => {
				uni.stopPullDownRefresh();
			}, 2000)
		}
	}
</script>

<style lang="scss" scoped>

</style>
